<template>
  <div>
    <div class="nav" v-show="titleArr.length !== 1">
      <bread-crumb :titleArr = "titleArr" @back = "returnMain" :fontSize="12"></bread-crumb>
    </div>
    <keep-alive>
      <component v-if="!editNode"
                 ref="processList"
                 v-bind:is="currentView"
                 @edit = "edit"
                 @nodeEditFun = 'nodeEditFun'
                 @back = "returnMain"
                 :currentProcess = "currentProcess"
                 :random="random"
                 :editRandom="editRandom"
                 :todoType="todoType"
      ></component>
    </keep-alive>
    <component v-if="editNode"
               v-bind:is="currentEditView"
               @back="returnMain"
               todoType="update"
               :dataId="dataNodeId"
               :showDeleteBtn="showDeleteBtn"
    ></component>
  </div>
</template>
<script>
  import breadCrumb from '@/components/ui-modules/breadCrumb/BreadCrumbConfig.vue'
  import entranceNode from '../nodeManagement/entranceNode/entranceNodeEdit.vue'
  import extenNode from '../nodeManagement/collectionNumNode/collectionNumEdit.vue'
  import queueNode from '../nodeManagement/skillGroupNode/skillGroupNodeEdit.vue'
  import timeNode from '../nodeManagement/timeNode/timeNodeEdit.vue'
  import robotNode from '../nodeManagement/robotNode/robotNodeEdit.vue'
  import leavemsgNode from '../nodeManagement/leaveMsgNode/leaveMsgNodeEdit.vue'
  import welcomeNode from '../nodeManagement/welcomeNode/welcomeNodeEdit.vue'
  import custRouteNode from '../nodeManagement/custRouteNode/custRouteNodeEdit.vue'
  import * as types from '@modules/config/channelConfig/webchatSchdule/mutation-types.js'
  import { deepClone } from '@utils/m7Utils.js'
  import edit from './processListEdit.vue'
  import processList from './processLists.vue'
  export default{
    name: 'processManagement',
    data () {
      return {
        todoType: 'add',
        currentView: 'processList',
        currentEditView: '',
        titleArr: [this.$t('config.channel.processManage')],
        accessId: '',
        webchatUrl: '',
        currentProcess: {},
        dataNodeId: '',
        showDeleteBtn: true,
        random: 0,
        editRandom: 0,
        editNode: false
      }
    },
    methods: {
      nodeEditFun (data) {
        console.log(data)
        this.titleArr.splice(1, 2, this.$t('configLazyLoad.process.modifyNode'))
        this.currentEditView = data.type + 'Node'
        this.dataNodeId = data._id
        this.editNode = true
        this.showDeleteBtn = false
      },
      returnMain (flag) {
        if (this.editNode) {
          this.currentView = 'edit'
          this.editNode = false
          this.currentEditView = ''
          this.titleArr.splice(1, 2, this.$t('configLazyLoad.process.modifyProcess'))
          this.editRandom = Math.random()
          let random = Math.random()
          this.$store.commit(types.SET_RELOAD_PROCESS, random)
        } else {
          this.currentView = 'processList'
          this.titleArr = [this.$t('config.channel.processManage')]
          this.$nextTick(() => {
            this.$refs.processList.refresh(flag)
          })
        }
      },
      edit (obj) {
        let todo = 'add'
        let data = {
          _id: '',
          account: '', // 账户id
          name: '', // 名称
          firstNodeType: 'entrance', // 开始节点类型
          firstNodeAccessType: '',
          firstNodeId: '', // 开始节点id
          createTime: '', // 创建时间
          createUser: '', // 创建人
          updateTime: '', // 修改时间
          updateUser: ''
        }
        if (obj) {
          this.titleArr.splice(1, 2, this.$t('configLazyLoad.process.modifyProcess'))
          todo = 'update'
          data = obj
        } else {
          this.titleArr.splice(1, 2, this.$t('configLazyLoad.process.addProcess'))
        }
        this.$store.commit(types.SET_CURRENT_PROCESS_EDIT, {data: data, todo: todo})
        this.random = Math.random()
        this.currentView = 'edit'
      }
    },
    components: {
      breadCrumb,
      edit,
      processList,
      entranceNode,
      extenNode,
      queueNode,
      timeNode,
      robotNode,
      leavemsgNode,
      welcomeNode,
      custRouteNode
    },
    beforeMount () {
      this.$store.dispatch('getNodeList', {}).then((res) => {
        if (res.success) {
          let allNode = deepClone(res.data)
          this.$store.commit(types.SET_ALL_WEBCHAT_SCHDULE_NODE_LIST, allNode)
          let entranceArr = []
          let agentArr = []
          let extenArr = []
          let leavemsgArr = []
          let robotArr = []
          let queueArr = []
          let timeArr = []
          let welcomeArr = []
          let custRouteArr = []
          allNode.forEach((item) => {
            if (item.type === 'entrance') {
              entranceArr.push(item)
            } else if (item.type === 'agent') {
              agentArr.push(item)
            } else if (item.type === 'exten') {
              extenArr.push(item)
            } else if (item.type === 'leavemsg') {
              leavemsgArr.push(item)
            } else if (item.type === 'robot') {
              robotArr.push(item)
            } else if (item.type === 'welcome') {
              welcomeArr.push(item)
            } else if (item.type === 'queue') {
              queueArr.push(item)
            } else if (item.type === 'time') {
              timeArr.push(item)
            } else if (item.type === 'custRoute') {
              custRouteArr.push(item)
            }
          })
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'entranceNode', data: entranceArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'agentNode', data: agentArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'extenNode', data: extenArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'leavemsgNode', data: leavemsgArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'robotNode', data: robotArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'welcomeNode', data: welcomeArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'queueNode', data: queueArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'timeNode', data: timeArr})
          this.$store.commit(types.RESET_WEBCHAT_SCHDULE_LIST_NODE, {node: 'custRouteNode', data: custRouteArr})
        }
      })
    }
  }
</script>
<style lang="stylus" scoped>

</style>
